@alifarooq93 We definitely need to make this generic as well. Maybe via handlebar and tiptap editor (like in our internal project) or via simple datastructure

type PopupConfig = {
    titleProp: string;
    details?: {
        label: string;
        prop: string;
    }[];
}

For the current dataset it would the be as

const popupConfig: PopupConfig = {
    titlePorp: 'BADEGEWAESSERNAME',
    details: [
        { label: t('quality'), prop: 'EINSTUFUNG_ODER_VORABBEWERTUNG' },
        { label: t('category'), prop: 'GEWAESSERKATEGORIE' },
        { label: t('depth'), prop: 'SICHTTIEFE' },
        { label: t('seasonal'), prop: 'SAISONBEGINN' }, // need o figure out how we can add SAISONENDE and GESCHLOSSEN
        { label: t('infrastructure'), prop: 'INFRASTRUKTUR' },
    ]
}

@alifarooq93 We should use the typescript safe definitions. See https://vuejs.org/guide/typescript/composition-api#typing-component-props and https://vuejs.org/guide/typescript/composition-api#typing-component-emits

@alifarooq93 Do we have a simple chance to avoid the any and use proper type definitions.

This is a global question.

@alifarooq93 The translation does not fit to the keys. So please adjust the keys so that it is clear that they are lake specific

@alifarooq93 What we actually wanted to achieve is that we one generic fetching logic for all configured input layers. So that we don't need to implement something for new use cases